/*
 * @Author: FengKongLi 
 * @Date: 2021-08-30 19:02:12 
 * @Last Modified by: FengKongLi
 * @Last Modified time: 2021-08-30 19:56:03
 */
// 订单页
<template>
  <div>
    <!-- NavBar导航栏 -->
    <div class="head">
      <van-nav-bar title="订单" left-text="返回" left-arrow>
        <template #right>
          <van-icon name="search" size="18" />
        </template>
      </van-nav-bar>
    </div>
    <!-- Tab标签页 -->
    <van-tabs v-model="activeName" @click="tabClick" color="#99CCFF">
      <van-tab title="全部" name="全部"></van-tab>
      <van-tab title="待接单" name="待接单"></van-tab>
      <van-tab title="待服务" name="待服务"></van-tab>
      <van-tab title="已完成" name="已完成"></van-tab>
    </van-tabs>
    <div>
      <order-list :key="key" :order_status="activeName"></order-list>
    </div>
  </div>
</template>

<script>
import orderList from "@/components/orderList.vue";
export default {
  name: "",
  data() {
    return {
      activeName: "全部",
      oldActive: "全部",
      // 重新渲染组件的 key
      key: 0,
    };
  },
  components: {
    orderList,
  },
  methods: {
    tabClick(name) {
      // if (this.activeName !== "全部") {
		  // this.status=this.activeName;
      // }
      if (name !== this.oldActive) {
        ++this.key;
        this.oldActive = name;
      }
    },
  },
};
</script>

<style scoped>
</style>